﻿
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="echarts.min.js"></script>
	    <script src="jquery-3.2.1.min.js"></script>
</head>
<body>
    <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:400px;"></div>
	
	
	
<script>
var myChart = echarts.init(document.getElementById('main'));
// 显示标题，图例和空的坐标轴
myChart.setOption({
    title: {
        text: '异步数据加载示例'
    },
    tooltip: {},
    legend: {
        data:['销量']
    },
    xAxis: {
        data: []
    },
    yAxis: {},
    series: [{
        name: '销量',
        type: 'bar',
        data: []
    }]
});

// 异步加载数据
$.getJSON('d.json').done(function (data) {
    // 填入数据
	//document.write(data)
    myChart.setOption({
        xAxis: {
            data: data.idx.categories
        },
        series: [{
            // 根据名字对应到相应的系列
            name: '销量',
            data: data.idx.data
        }]
    });
});
</script>
	
</body>
</html>